<template>
	<view style="width: 100%;height: 100%;">
		<view style="height: 1rpx;"></view>
		<scroll-view scroll-y="true" :style="{height:windowHeight}">
			<view>
				<view style="background-color: #ffffff;padding-left: 32rpx;padding-right: 32rpx;">
					<view style="height: 108rpx;display: flex;align-items: center;">
						<text class="title">关联客户<text class="star">*</text></text>
						
						<view class="xuanze" @click="chooseCustom">
							<text :class="customDetail==null ? 'xuanze-t':'xuanze-tt'">{{customDetail==null ? '请选择关联客户':customDetail.name}}</text>
							<image src="../../../../static/phone/quxuanze.png" class="xuanze-i"></image>
						</view>
						
					</view>
					
					<view class="line"></view>
					
					<view style="height: 108rpx;display: flex;align-items: center;">
						<text class="title">咨询领域<text class="star">*</text></text>
						
						<view class="xuanze" @click="chooseConsultation">
							<text :class="consultationId==-1 ? 'xuanze-t':'xuanze-tt'">{{consultationId==-1 ? '请选择咨询领域':consultation}}</text>
							<image src="../../../../static/phone/quxuanze.png" class="xuanze-i"></image>
						</view>
						
					</view>
					
					<view v-if="consultation=='诉讼保全'">
						<view class="line"></view>
						
						<view style="height: 108rpx;display: flex;align-items: center;">
							<text class="title">标的名称</text>
							<input type="text" v-model="targetName"
							placeholder="请填写标的名称" class="placeholder-view">
						</view>
						
						<view class="line"></view>
						
						<view style="height: 108rpx;display: flex;align-items: center;">
							<text class="title">对方名称</text>
							<input type="text" v-model="otherName"
							placeholder="请填写对方名称" class="placeholder-view">
						</view>
					</view>
				
					
					<view class="line"></view>
					
					<view style="height: 108rpx;display: flex;align-items: center;">
						<text class="title">希望我们<text class="star">*</text></text>
						
						<view class="xuanze" @click="chooseHope">
							<text :class="hopeId==-1 ? 'xuanze-t':'xuanze-tt'">{{hopeId==-1 ? '请选择咨询领域':hope}}</text>
							<image src="../../../../static/phone/quxuanze.png" class="xuanze-i"></image>
						</view>
						
					</view>
					
				</view>
				
				
				<view style="background-color: #ffffff;;height: 410rpx;margin-top: 24rpx;">
					<view style="padding-top: 32rpx;padding-left:32rpx;padding-bottom:28rpx">
							<text class="title">咨询内容<text class="star">*</text></text>
					</view>
					
					<view class="uni-textarea" 
					style="width: 686rpx;height: 280rpx;border-radius: 4rpx;border: 1rpx dashed #EEEEEE;margin-left:32rpx">
						<textarea placeholder="请填写咨询内容" 
							placeholder-style="color:#999999;font-size:28rpx" 
							class="textarea"
							style="width: 622rpx;"
							maxlength="140"
							v-model="content"
						/>	
					</view>
				</view>
				
				<view style="background-color: #ffffff;
						margin-top: 24rpx;padding-left: 32rpx;padding-right: 32rpx;">
					<view class="upload-view-top">
						<text class="title">上传文件</text>
						<view class="upload-view-top-right" @click="uploadClick">
							添加
						</view>
					</view>
					
					<view v-for="(item,index) in fileList" :key="index">
						<view class="file-item">
							<text class="file-item-text">{{item.name}}</text>
							<image src="../../../../static/phone/icon_detele.png" 
							style="width: 28rpx;height: 28rpx;margin-left: 16rpx;" @click="deleteFile(item,index)"></image>
							
							<text class="file-item-text2" @click="preview(item)">预览</text>
							
						</view>
						
					</view>
				</view>
				
			</view>
		</scroll-view>
		<view class="view-bottom">
			<view class="view-bottom-s">
				<view class="view-bottom-l" @click="saveIt">
					保存
				</view>
				<view class="view-bottom-r" @click="doIt(1)">
					<text class="view-bottom-r-t">确定</text>
				</view>
			</view>
			<!-- <view style="height: 68rpx;background: #ffffff;" v-if="needAdapt"> -->
				<!-- 苹果x及以上的安全距离 -->
			<!-- </view> -->
		</view>
		
		<common-choose v-if="showChoose" :chooseList="chooseList" :chooseResult="chooseResult" :chooseTag="chooseTag"
			@gotIt="gotIt" @closeIt="closeIt"></common-choose>
		
		<link-customer v-if="showLink" @closeLink="closeLink" :linkList="dataList" :tag="tag"
		  @launchIt="launchIt"></link-customer>
		  
		  
		<view class="zhezhao" v-if="showUpload">
			<view class="zhezhao-view-bottom">
				<view class="zhezhao-choose-body-item" @click="clickOptionsPanel(2)">
					手机相册
				</view>
				<view class="zhezhao-line"></view>
				<view class="zhezhao-choose-body-item"  @click="clickOptionsPanel(0)">
					微信图片
				</view>
				<view class="zhezhao-line"></view>
				<view class="zhezhao-choose-body-item"  @click="clickOptionsPanel(1)">
					微信文件
				</view>
				<view class="zhezhao-line"></view>
				<view class="zhezhao-choose-body-item"  @click="clickOptionsPanel(4)">
					取消
				</view>
			</view>
		</view>  
			
			
	</view>
</template>

<script>
	import commonChoose from '@/pages/phone/common/commonChoose.vue'
	import linkCustomer from '@/pages/phone/common/linkCustomer.vue'
	import verify from '@/pages/utils/verifyUtils.js'
	import requsetFileId from '@/pages/utils/upload.js'
	let app = ''
	export default{
		components:{commonChoose,linkCustomer},
		data(){
			return{
				role:'',
				roleUrl:'',
				id:'',//主键id，用于重新编辑时
				windowHeight:0,
				needAdapt: false, //判断是不是苹果x以上机型
				dataList:[],
				customValue:-1,
				custom:'',
				customDetail:null,
				
				consultationValue:'',
				consultationId:-1,
				consultation:'',
				siftFieldList: [],//领域
				
				hopeValue:'',
				hopeId:-1,
				hope:'',
				siftHopeList: [],//希望我们
				
				content:'',
				
				
				showChoose:false,
				chooseList:'',
				chooseResult:'',
				chooseTag:'',
				
				
				showLink:false,
				tag:'launch',
				
				fileList:[],//文件列表
				showUpload:false,
				
				otherName:'',
				targetName:'',
				
				from:'',//来源  add  edit
				
			}
		},
		onLoad(options) {
			app = getApp()
			var _this = this
			_this.needAdapt = app.globalData.needAdapt && app.globalData.isIPhone
			// if(_this.needAdapt){
			// 	_this.windowHeight = (app.globalData.windowHeight - 88)*2 + 'rpx'
			// }else{
			// 	_this.windowHeight = (app.globalData.windowHeight - 54)*2 + 'rpx'
			// }
			if(app.globalData.isIPhone){
				if (app.globalData.isMax) {
					_this.windowHeight = (app.globalData.windowHeight - 140 - app.globalData.statusBarHeight) * 2 + 'rpx'
					// _this.scrollViewHeight = app.globalData.windowHeight - 180 - app.globalData.statusBarHeight
				} else if (app.globalData.isPlus) {
					_this.windowHeight = (app.globalData.windowHeight - 100 - app.globalData.statusBarHeight) * 2 + 'rpx'
					// _this.scrollViewHeight = app.globalData.windowHeight - 140 - app.globalData.statusBarHeight
				} else {
					_this.windowHeight = (app.globalData.windowHeight - 70 - app.globalData.statusBarHeight) * 2 + 'rpx'
					// _this.scrollViewHeight = app.globalData.windowHeight - 110 - app.globalData.statusBarHeight
				}
			}else{
				_this.windowHeight = (app.globalData.windowHeight-40 ) * 2 + 'rpx'
				// _this.scrollViewHeight = app.globalData.windowHeight-110
			}
			
			_this.role = app.globalData.role
			_this.roleUrl =  _this.$roleUrl({tab:_this.role})
			
			
			//获取咨询领域
			_this.getConsult_domain()
			//获取希望我们
			_this.getConsult_hope()
			_this.from = options.from
			if(options.from==='edit'){
				//来自编辑，数据回显
				setTimeout(function() {
					_this.setData(JSON.parse(options.item))
				}, 100);
				
			}
		},
		onShow() {
			//权限查询
			this.customerRights_check()
		},
		mounted() {
			
		},
		methods:{
			
			//数据回显
			setData(data){
				let _this = this
				console.log('数据回显',data)
				_this.customDetail={
					name: data.custName,
					id:data.custId
				}
				//案件的主键id
				_this.id = data.id
				_this.consultationValue = data.domainDict
				_this.consultationId = 0
				_this.consultation = data.domainDict
				
				_this.hopeValue= data.hopeDict
				_this.hopeId= 0
				_this.hope= data.hopeDict
				
				
				_this.content = data.content
				
				if(data.domainDict=='诉讼保全'){
					_this.otherName = data.otherName
					_this.targetName = data.targetName
				}
				
				let list = data.attachFile
				for (var i = 0; i < list.length; i++) {
					
					let name = list[i]['name']
					if(name.length>20){
						name = name.substring(0,15)+'...'+'.'+ list[i].fileSuffix
					}
					
					let fileData={
						ids:list[i].id,
						uploadPath:list[i].fileUrl,
						name:name,
						fileSuffix:list[i].fileSuffix,
					}
					_this.fileList.push(fileData)
				}
				
				
			},

			//查询剩余次数
			async customerRights_check(){
				let _this = this
				uni.showLoading({
					title:'正在查询...'
				})
				const res = await _this.$myRequest({
					url: `/${_this.roleUrl}/case/check`,
				})
				uni.hideLoading()
				console.log('查询次数',res)
				if(res.data.code==200){
					let list = res.data.data
					
					let size = list.length
					if(size===0){
						uni.showModal({
							title:'提示',
							content:'未查询到当前有可咨询的次数，请先购买咨询服务吧~',
							success: (res) => {
								if(res.confirm){
									uni.navigateTo({
										url:'../buyServe/buyServe'
									})
								}else{
									uni.navigateBack({
										delta:-1
									})
								}
							}
						})
					}else if(size===1){
						_this.dataList = list
						if(_this.from!='edit'){
							_this.customDetail = list[0]
						}
						
					}else{
						_this.dataList = list
					}
				}
				
			},
			
			
			
			//咨询领域
			async getConsult_domain(){
				let _this = this
				const res = await _this.$myRequest({
					url: "/comm/dict/list/param_consult_domain",
				})
				console.log('咨询领域',res)
				if(res.data.code==200){
					let list = res.data.data
					for (var i = 0; i < list.length; i++) {
						list[i]['sel'] = false
					}
					_this.siftFieldList = list
				}
			},
			
			//希望我们
			async getConsult_hope(){
				let _this = this
				const res = await _this.$myRequest({
					url: "/comm/dict/list/param_consult_hope",
				})
				console.log('希望我们',res)
				if(res.data.code==200){
					let list = res.data.data
					for (var i = 0; i < list.length; i++) {
						list[i]['sel'] = false
					}
					_this.siftHopeList = list
					
				}
			},
			
			/**
			 * 选择关联客户
			 */
			chooseCustom(){
			
				if(this.dataList.length==0){
					uni.showModal({
						title:'提示',
						content:'未查询到当前有可咨询的次数，请先购买咨询服务吧~',
						success: (res) => {
							if(res.confirm){
								uni.navigateTo({
									url:'../buyServe/buyServe'
								})
							}else{
								uni.navigateBack({
									delta:-1
								})
							}
						}
					})
				}else if(this.dataList.length==1){
					if(this.from == 'edit'){
						this.showLink = true
					}else{
						uni.showModal({
							title:'提示',
							showCancel:false,
							content:'查询到当前只有一个关联客户',
							success: (res) => {
								
							}
						})
					}
					
				}else{
					this.showLink = true
				}
				
			},
			closeLink(){
				this.showLink = false
			},
			//获取选中的用户
			launchIt(use){
				this.customDetail = use
				// console.log(use)
				console.log(this.customDetail)
			},
			/**
			 * 选择咨询领域
			 */
			chooseConsultation(){
				let _this = this
				_this.chooseTag = 'consultation'
				_this.chooseList = _this.siftFieldList
				_this.chooseResult = _this.consultation
				_this.$nextTick(() => {
					_this.showChoose = true
				})
			},
			/**
			 * 选择希望我们
			 */
			chooseHope(){
				let _this = this
				_this.chooseTag = 'hope'
				_this.chooseList = _this.siftHopeList
				_this.chooseResult = _this.hope
				_this.$nextTick(() => {
					_this.showChoose = true
				})
			},
			
			/**
			 * 点击添加
			 */
			uploadClick(){
				this.showUpload = true
			},
			/**
			 * 选择文件途径
			 */
			clickOptionsPanel(val){
				let _this = this
				if(val===2){
					//手机相册
					uni.chooseImage({
						count: 1,
						sizeType: ['compressed'],
						sourceType: ['album'],
						success(res) {
							console.log('chooseImage', res)
							let tempFilePaths = res.tempFilePaths[0]
					
					
							_this.upLoadFile(tempFilePaths, 2)
					
					
						}
					})
				}else if(val===0){
					//微信图片
					uni.chooseMessageFile({
						type: 'image',
						success(res) {
							console.log('chooseMessageFile', res)
							let tempFiles = res.tempFiles[0]
							_this.upLoadFile(tempFiles, 0)
					
						}
					})
				}else if(val===1){
					//微信文件
					uni.chooseMessageFile({
						type: 'file',
						extension: ['.ppt', '.doc', '.docx', '.xlsx', '.pdf'],
						success(res) {
							console.log('chooseMessageFile', res)
							let tempFiles = res.tempFiles[0]
							let name = tempFiles.name
							let path = tempFiles.path
							let size = tempFiles.size
							let time = tempFiles.time
							let type = tempFiles.type
					
							_this.upLoadFile(tempFiles, 1)
					
						}
					})
				}else if(val===4){
					_this.showUpload = false
				}
			},
			/**
			 * 文件上传
			 */
			async upLoadFile(path, index) {
				console.log('文件上传path',path)
				console.log('文件上传index',index)
				let _this = this
				let uploadPath = ''
				let name = ''
				let fileSuffix = ''
				let fileSuffixArray = []
				
				if (index == 0 || index == 1) {
					//选择微信图片或者微信文件
					uploadPath = path.path
					name = path.name
				} else if (index == 2 ) {
					//选择手机相册
					uploadPath = path
					name = path
				}
				fileSuffixArray = uploadPath.split('.')
			
				fileSuffix = fileSuffixArray[fileSuffixArray.length-1]
				
				uni.showLoading({
					title:'正在上传...'
				})
				let ossPath = 'temp/test'
				const uploads = await requsetFileId.uploads(ossPath,uploadPath,name,fileSuffix)
				console.log('uploads',uploads)
				uni.hideLoading()
				if(uploads.data.code==200){
					uni.showToast({
						title:'文件添加成功!',
						icon:'success'
					})
					_this.showUpload = false
					if(name.length>20){
						name = name.substring(0,15)+'...'+'.'+fileSuffix
					}
					
					let ids = uploads.data.data.id
					let fileData={
						ids:ids,
						uploadPath:uploadPath,
						name:name,
						fileSuffix:fileSuffix
					}
					_this.fileList.push(fileData)
					_this.showUpload = false
				}
				
			},
			
			deleteFile(item,index){
				this.fileList.splice(index,1)
			},
			
			/**
			 * 保存
			 */
			saveIt(){
				// console.log(this.content)
				this.doIt(0)
			
			},
			/**
			 * 确定
			 */
			async doIt(val){
				let _this = this
				console.log('doIt')
				if(!verify.isNotEmpty(_this.customDetail)){
					uni.showToast({
						title:'请选择关联客户',
						icon:'none'
					})
					return
				}
				if(_this.consultationId==-1){
					uni.showToast({
						title:'请选择咨询领域',
						icon:'none'
					})
					return
				}
				if(_this.hopeId==-1){
					uni.showToast({
						title:'请选择希望我们',
						icon:'none'
					})
					return
				}
				if(!verify.isNotEmpty(_this.content)){
					uni.showToast({
						title:'请填写咨询内容',
						icon:'none'
					})
					return
				}
				
				let data={
					custId:_this.customDetail.id,
					custName:_this.customDetail.name,
					domainDict:_this.consultationValue,
					hopeDict:_this.hopeValue,
					content:_this.content,
				}
				
				uni.showLoading({
					title:'正在提交...'
				})
				
				if(_this.fileList.length>0){
					let attachFileIds = []
					for (var i = 0; i < _this.fileList.length; i++) {
						let id = _this.fileList[i]['ids']
						attachFileIds.push(id)
					}
					_this.$set(data, 'attachFileIds', attachFileIds);
				}
				
				if(_this.consultationValue=='诉讼保全'){
					if(verify.isNotEmpty(_this.otherName)){
						_this.$set(data, 'otherName', _this.otherName);
					}
					if(verify.isNotEmpty(_this.targetName)){
						_this.$set(data, 'targetName', _this.targetName);
					}
				}		
				if(_this.from ==='edit'){
					_this.$set(data, 'id', _this.id);
				}
				const res = await _this.$myRequest({
					url: `/${_this.roleUrl}/case/${val}`,
					data:data,
					method:_this.from ==='add' ? 'POST' : 'PUT',
				})
				uni.hideLoading()
				console.log('提交结果',res)
				if(res.data.code==200){
					if(val===0){
						uni.showToast({
							title:'保存成功',
							icon:'success',
							duration:2000
						})
					}else{
						uni.showToast({
							title:'咨询发起成功!',
							icon:'success',
							duration:2000
						})
					}
					uni.setStorageSync("initated","initated")
					// _this.$EventBus.$emit('initated');
					setTimeout(function() {
						
						uni.navigateBack({
							delta:-1
						})
					}, 2000);
					
				}else{
					uni.showModal({
						title:'提示',
						content:res.data.msg,
						showCancel:false,
						success: (res) => {
							if(res.confirm){
								// uni.navigateBack({
								// 	delta:-1
								// })
							}
						}
					})
				}
				
				
				
			},
			
			
			gotIt(val){
				let _this = this
				_this.showChoose = false
				let tag = val.split(";")[0]
				let index = val.split(";")[1]
				if (tag == 'consultation') {
					_this.consultationValue = _this.siftFieldList[index]['value']
					_this.consultation = _this.siftFieldList[index]['name']
					_this.consultationId = _this.siftFieldList[index]['id']
				} else if (tag == 'hope') {
					_this.hopeValue = _this.siftHopeList[index]['value']
					_this.hope = _this.siftHopeList[index]['name']
					_this.hopeId = _this.siftHopeList[index]['id']
				}
			},
			closeIt(){
				this.showChoose = false
			},
			
			/**
			 * 预览文档
			 */
			async preview(item,index){
				console.log('预览文件',item)
				
				let ss = item.uploadPath
				let fileSuffix = item.fileSuffix
				if(ss.indexOf('http')<0){
					const res = await this.$myRequest({
						url: `/comm/oss/url`,
						data:{
							ossPath:ss
						},
						method:'GET',//默认是GET
					})
					
					if(res.data.code==200){
						ss = res.data.data.url
					}
					
				}
				if(fileSuffix =='jpg' || fileSuffix=='png'|| fileSuffix=='jpeg'){
					let ssl = []
					ssl.push(ss)
					uni.previewImage({
						indicator: "none", //图片指示器样式
						current:0,
						urls:ssl,
						success: (img) => {
							// console.log(img)
						}
					})
				}else{
					uni.downloadFile({
						url:ss,
						success: (downloadFile) => {
							console.log(downloadFile)
							uni.openDocument({
								filePath:downloadFile.tempFilePath
							})
						}
					})
					
				}
				

			},
		}
	}
</script>

<style scoped lang="scss">
	page{
		background-color: #f7f7f7;
	}
	.view-bottom{
		position: fixed;
		width: 100%;
		bottom: 0;
		background-color: #ffffff;
		border-top: 1rpx #eeeeee solid;
		padding-bottom: env(safe-area-inset-bottom); // 适配iphoneX的底部
	}
	.view-bottom-s{
		height: 108rpx;
		display: flex;
		align-items: center;
	}
	.title{
		font-size: 28rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;
	}
	.star{
		color: #FF6132;
	}
	.line{
		height: 1rpx;
		background-color: #eeeeee;
	}
	.line2{
		height: 24rpx;
		background-color: #f7f7f7;
	}
	.placeholder-view{
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		margin-left: auto;
		text-align: right;
	}
	.open-close{
		font-size: 24rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #2DA9C5;
	}
	
	.xuanze{
		margin-left: auto;
		display: flex;
		align-items: center;
	}
	.xuanze-t{
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #888888;
		margin-right: 5rpx;
	}
	.xuanze-tt{
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		margin-right: 5rpx;
	}
	.xuanze-i{
		width: 12rpx;
		height: 24rpx;
	}
	
	.view-bottom-l{
		width: 260rpx;
		height: 88rpx;
		border-radius: 44rpx;
		border: 2rpx solid #2DA9C5;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #2DA9C5;
		margin-left: 32rpx;
	}
	.view-bottom-r{
		width: 394rpx;
		height: 88rpx;
		background: #2DA9C5;
		border-radius: 58rpx;
		margin-left: 32rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		
	}
	.view-bottom-r-t{
		font-size: 36rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #E8F7FB;
		letter-spacing:6rpx	
	}
	
	.shurukuang{
		width: 686rpx;
		height: 280rpx;
		border-radius: 4rpx;
		border: 1rpx dashed #EEEEEE;
		margin-left: 32rpx;
	}
	
	.textarea{
		padding-left: 32rpx;
		padding-right: 32rpx;
		padding-top: 24rpx;
		padding-bottom: 24rpx;
		font-size: 28rpx;
		color: #333333;
		line-height: 20rpx;
		
	}
	
	.upload-view-top{
		height: 104rpx;
		display: flex;
		align-items: center;
	}
	.upload-view-top-right{
		width: 90rpx;
		height: 40rpx;
		background: #E8F7FB;
		border-radius: 24rpx;
		margin-left: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 24rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #2DA9C5;
	}
	
	
	.file-item{
		display: flex;
		padding-top: 8rpx;
		padding-bottom: 16rpx;
		line-height: 30rpx;
		height: 30rpx;
		align-items: center;
	}
	.file-item-text{
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
	}
	.file-item-text2{
		font-size: 24rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
		margin-left: auto;
	}
</style>

<style scoped lang="scss">
	.zhezhao{
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.4);
		z-index: 999;
		position: fixed;
		left: 0;
		top: 0;
		overflow: scroll;	
		// padding-top: 10vh;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.zhezhao-view-bottom{
		position: fixed;
		width: 100%;
		bottom: 0;
		background-color: #FFFFFF;
		border-top-left-radius: 10rpx;
		border-top-right-radius: 10rpx;
		padding-bottom: env(safe-area-inset-bottom); // 适配iphoneX的底部
	}
	.zhezhao-choose-body-item{
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
	}
	.zhezhao-line{
		// width: 100%;
		background-color: #eeeeee;
		height: 1rpx;
		margin-left: 32rpx;
		margin-right: 32rpx;
	}
</style>